<template>
    <div class="w">
        <div style="padding-bottom: 70px;">
            <!-- 全部标讯 -->
            <TenderContent v-if="activeKeys == '1'" />
            <!-- 供应商 -->
            <VendorData v-if="activeKeys == '2'" />
            <!-- 采购商 -->
            <Purcdata v-if="activeKeys == '3'" />
            <!-- 联系人 -->
            <Assolxr v-if="activeKeys == '4'" />
            <!-- 竞争对手 -->
            <RivalryPkxq v-if="activeKeys == '5'" />
        </div>
        <div class="Daobuttom">
            <div class="reprovision">最多显示300条，更多数据导出后可查看</div>
            <el-button class="consult" type="primary" :loading-icon="Eleme" :loading="logflg" @click="deriveClick">
                <img style="margin-right: 10px; width: 14px;height: 14px;" src="@/assets/img/mypoints/dc1.png" alt="">
                导出
            </el-button>
            <!-- <div  @click="deriveClick" >
                <img style="margin-right: 10px; width: 14px;height: 14px;" src="@/assets/img/mypoints/dc1.png" alt="">
                导出数据
            </div> -->
        </div>
    </div>
    <DeriveLiss />
</template>

<script setup>
import DeriveLiss from "../search/computer/deriveLiss/index.vue"; //弹框
import TenderContent from "../search/computer/tenderContent/index.vue";
import VendorData from "../search/computer/vendorData/index.vue";
import Purcdata from "../search/computer/purcdata/index.vue";
import Assolxr from "./conster/assolxr/index.vue";
import RivalryPkxq from "./conster/rivalryPkxq/index.vue";

import { useRadio1Store } from "@/pain/search/search";
import { useRouter } from "vue-router";
import { reactive, ref, onMounted } from "vue";
import { downloadFileByBase64 } from '@/utils/daochu/index'
import { Dataexportsupplier, Dataexportbuyer, Datcontacts_export, Datcompetitor_export } from "@/Api/shoop/index";
import { Eleme } from '@element-plus/icons-vue'
let activeKeys = ref('')
const route = useRouter();
const signalsRadio1 = useRadio1Store();
let logflg = ref(false)
const deriveClick = () => {
    logflg.value = true
    console.log(signalsRadio1.T_provider)
    const today = new Date();
    const year = today.getFullYear();
    const month = today.getMonth() + 1;
    const day = today.getDate();
    const formattedDate = `${year}-${month < 10 ? '0' : ''}${month}-${day < 10 ? '0' : ''}${day}`;
    const daochu = JSON.parse(localStorage.getItem("daochu"));
    const ditu = JSON.parse(localStorage.getItem("ditu"));
    if (route.currentRoute.value.query.id == '1') {
        signalsRadio1.derive = true
        logflg.value = false
    } else if (route.currentRoute.value.query.id == '2') {
        Dataexportsupplier({ ...daochu, ...ditu }).then(res => {
            downloadFileByBase64(res.data, 'application/vnd.ms-excel', `供应商${formattedDate}`);
            logflg.value = false
        })
    } else if (route.currentRoute.value.query.id == '3') {
        Dataexportbuyer({ ...daochu, ...ditu }).then(res => {
            downloadFileByBase64(res.data, 'application/vnd.ms-excel', `采购商${formattedDate}`);
            logflg.value = false
        })
    } else if (route.currentRoute.value.query.id == '4') {
        Datcontacts_export(daochu).then(res => {
            downloadFileByBase64(res.data, 'application/vnd.ms-excel', `联系人${formattedDate}`);
            logflg.value = false
        })
    } else if (route.currentRoute.value.query.id == '5') {
        Datcompetitor_export(daochu).then(res => {
            downloadFileByBase64(res.data, 'application/vnd.ms-excel', `竞争对手${formattedDate}`);
            logflg.value = false
        })
    }

}
onMounted(() => {
    activeKeys.value = route.currentRoute.value.query.id
    // "details"
    signalsRadio1.routerdetails = route.currentRoute.value.query.id
    signalsRadio1.routerPush = route.currentRoute.value.name
});
</script>

<style lang="scss" scoped>
.w {
    width: 1200px;
    margin: 0 auto;
}

.Daobuttom {
    position: fixed;
    bottom: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 1200px;
    height: 64px;
    padding: 0 24px 0 40px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 11px 0 rgba(19, 84, 86, .14);
    z-index: 10;

    .reprovision {
        height: 40px;
        margin-right: 15px;
        line-height: 40px;
        text-align: center;
        font-size: 14px;
        color: #74798c;
        cursor: pointer;
    }

    .consult {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 112px;
        height: 40px;
        background-color: #6675FF;
        margin-right: 15px;
        border: none;
        border-radius: 4px;
        text-align: center;
        font-size: 14px;
        color: #fff;
        cursor: pointer;

    }
}
</style>